<template>
	<view>
		<u-sticky>
			<u-tabs :list="list1" lineWidth="60rpx" lineColor="#264AA2"
				:activeStyle="{color: '#264AA2',fontSize: '30rpx',fontFamily:'PingFang SC',fontWeight: '500' }"
				:inactiveStyle="{color: '#1F1F1F',fontSize: '30rpx',fontFamily:'PingFang SC',fontWeight: '500'}"
				:scrollable="false" @click="sectionChange">
			</u-tabs>
		</u-sticky>

		<!-- 顶部案件状态 -->
		<view class="status">
			<view class="status_acceptcode">{{rcord.acceptcode || acceptcode}}</view>
			<view class="status_lable">{{statusLable(rcord)}}</view>
		</view>

		<view>
			<view class="dad" style="margin-top: -30rpx;">
				<view v-if="curNow == 0">
					<u-collapse ref="heightview" :accordion="false" @close="closeCollapseundo" @open="openCollapseundo"
						:value="showValueListundo">
						<u-collapse-item :title="item.materialName" v-for="(item, index) in undoList" :key="item.id"
							:name="index" :class="showOpenFlagListundo[index] ? 'open-flag' : ''" class="item">
							<view slot="title" class="item_title">
								<view class="item_title_select">
									<view :class="item.flag?'item_title_select_flag':'item_title_select_flag1'"
										@click.stop="checkbox(item)">
										<u-icon v-show="item.flag" size="20px" name="checkbox-mark"
											color="#fff"></u-icon>
									</view>
								</view>
								<view class="item_title_name">{{item.materialName}}</view>
							</view>
							<view class="item_content">
								<view class="item_content_tip">
									<view class="item_content_tip_text">
										<view>提醒</view>
									</view>
									<view class="item_content_tip_status">
										<view class="tip" v-if="daysBetweenDates(item.warntime)>=0"
											style=" right: 5%;float: right;">
											<view class="item_content_tip_status_flag"></view>
											<view style="margin-left: 10rpx;">剩余{{daysBetweenDates(item.warntime)}}天到期
											</view>
										</view>
										<view class="tip" v-else-if="daysBetweenDates(item.warntime)<0"
											style=" right: 5%; float: right;">
											<view class="item_content_tip_status_warm"></view>
											<view style="margin-left: 10rpx;font-size: 28rpx;">
												已逾期{{Math.abs(daysBetweenDates(item.warntime))}}天</view>
										</view>
									</view>
								</view>

								<u-divider :hairline="true"></u-divider>
								<view class="tip" style="margin-top: 40rpx; margin-bottom: 40rpx;">
									<view style="width: 25%;height: 2rem;color: #ACACAC;font-size: 28rpx;">
										<view>
											送达文件：
										</view>
									</view>
									<view class="file">
										<view>
											<view v-for="(material, materialIndex) in item.materialList"
												:key="materialIndex" class="file_list">
												<view v-if="material.file.filename.length>=15" class="file_list_name"
													@click="fileView(material)">
													{{ material.file.filename.substring(0,13)+'...'}}
												</view>
												<view v-else class="file_list_name" @click="fileView(material)">
													{{ material.file.filename}}
												</view>
											</view>
										</view>
									</view>
								</view>

								<u-divider :hairline="true"></u-divider>
								<view class="add">
									<view class="add_title">新增送达人</view>
									<view v-for="(person, personIndex) in item.personList" :key="personIndex"
										class="add_people">
										<view class="add_people_info" @click="review(personIndex,index)">
											<view style="width: 30rpx; height: 30rpx; padding: 30rpx;">
												<u-icon name="checkmark-circle-fill" color="green"></u-icon>
											</view>
											<view>{{person.recipient}}</view>
											<view style="padding: 30rpx;">{{person.phone}}</view>
											<u-icon name="arrow-right"></u-icon>
										</view>
										<view style="width: 15%; height: 100rpx; align-items: center;"
											@click="deletePersonInfo(index,personIndex)">
											<view style="padding: 30rpx;">
												<u-icon name="trash" size="25"></u-icon>
											</view>
										</view>
									</view>
									<view class="add_button" style=" " @click="addPerson(index)">
										<view class="add_button_icon">
											<u-icon name="plus" size="21" color="rgba(32, 116, 212, 1)"></u-icon>
										</view>
										<view class="add_button_lable">添加送达信息</view>
									</view>
								</view>
							</view>
						</u-collapse-item>
					</u-collapse>

				</view>


				<view v-if="curNow == 1">
					<u-collapse :accordion="false" @close="closeCollapsedone" @open="openCollapsedone"
						:value="showValueListdone">
						<u-collapse-item v-for="(item, index) in doneList" :key="item.id" :name="index"
							:class="showOpenFlagListdone[index] ? 'open-flag' : ''" class="collapse">
							<view slot="title" class="collapse_title">
								<view>{{item.materialName}}</view>
							</view>
							<view class="collapse_content">
								<view class="stx" style="margin-top: 2rem; margin-bottom: 1rem;">
									<view style="color: #ACACAC;">创建时间：</view>
									<view>{{item.finishtime}}</view>
								</view>
								<u-divider :hairline="true"></u-divider>
								<view style="margin-top: 1rem;">
									<view style="color: #ACACAC;">送达文件：</view>
									<view class="arrivefilelist" v-for="(material, materialIndex) in item.materialList"
										:key="materialIndex">
										<view class="arrivefilelist_name" @click="fileView(material)">
											{{ material.file.filename}}
										</view>
									</view>
								</view>
							</view>
						</u-collapse-item>
					</u-collapse>
				</view>
			</view>
		</view>
		<view class="sendbutton">
			<u-button class="sendbutton_sty" size="large" text="送达" @click="arriveSend()" style=""></u-button>
		</view>


		<!-- 添加信息的弹窗 -->
		<u-popup :show="show" @close="close" @open="open" mode="center" :closeable="true" :round="10"
			:customStyle="popupStyle" zIndex="900">
			<view style="width: 90%;height: 80%; margin: auto;">
				<view style="width: 90%; margin: auto; ">
					<view style="font-weight: 900;margin-bottom: 30rpx;">受送达人信息</view>
					<u--form labelPosition="left" :model="model1" :rules="rules" ref="uForm" :labelStyle="labelStyle">
						<u-form-item label="收件人:" prop="recipient" borderBottom ref="item1" :required="true"
							:value="model1.recipient" @click="showRecipient=true">
							<u--input v-model="model1.recipient" disabled placeholder="请选择收件人" disabledColor="#ffffff"
								border="none" style="margin-left: 20rpx;"></u--input>
							<u-icon slot="right" name="arrow-down-fill"></u-icon>
						</u-form-item>

						<u-form-item label="联系方式:" prop="contactMode" borderBottom ref="item1" :required="true">
							<u--input v-model="model1.contactMode" placeholder="请填写联系方式" disabledColor="#ffffff"
								border="none" style="margin-left: 20rpx;"></u--input>
						</u-form-item>

						<u-form-item label="发出时间:" prop="deliveryTime" borderBottom @click="showCalendar=true"
							ref="item1" :required="true">
							<u--input v-model="model1.deliveryTime" disabled disabledColor="#ffffff"
								placeholder="请选择发出时间" border="none" style="margin-left: 20rpx;"></u--input>
							<u-icon slot="right" name="arrow-down-fill"></u-icon>
						</u-form-item>

						<u-form-item label="送达方式:" prop="deiveryMode" borderBottom @click="showSend = true;" ref="item1"
							:required="true">
							<u--input v-model="model1.deliveryMode" disabled disabledColor="#ffffff"
								placeholder="请选择送达方式" border="none" :value="model1.deliveryMode"
								style="margin-left: 20rpx;"></u--input>
							<u-icon slot="right" name="arrow-down-fill"></u-icon>
						</u-form-item>

						<u-form-item label="邮寄单号:" prop="mailNum" borderBottom :required="true" v-if="mailNumView">
							<u--input v-model="model1.mailNum" disabledColor="#ffffff" placeholder="邮寄单号" border="none"
								:value="model1.mailNum" style="margin-left: 20rpx;"></u--input>
						</u-form-item>
						<u-form-item label="邮寄地址:" prop="mailAdress" borderBottom :value="model1.mailAddress"
							:required="true" v-if="mailAdress">
							<u--input v-model="model1.mailAddress" disabledColor="#ffffff" placeholder="邮寄地址"
								border="none" :value="model1.mailAddress" style="margin-left: 20rpx;"></u--input>
						</u-form-item>
						<u-form-item label="文书材料:" borderBottom ref="item1" :borderBottom="false">
						</u-form-item>
						<!-- 上传组件 -->
						<Upload @f_echoids="s_disposi_echoids" uploadtype="uploadImg" @fileList='emitfile()'
							:value='fileids' />
					</u--form>

					<u-button text="确认" size="large" @click="save"
						style="bottom: 50rpx; position: absolute; width: 90%; right: 5%; color: #FFF;"></u-button>

					<u-action-sheet :show="showRecipient" :actions="actionsRecipient" title="请选择收件人"
						@close="recipientClose" @select="recipientSelect">
					</u-action-sheet>

					<u-action-sheet :show="showSend" :actions="actions" title="请选择送达方式" @close="sendClose"
						@select="sexSelect">
					</u-action-sheet>

					<u-calendar :show="showCalendar" :mode="modeCalendar" @close="closeCalendar"
						@confirm="successCalendar"></u-calendar>
				</view>
			</view>
		</u-popup>


		<!-- 消息提示 -->
		<u-toast ref="uToast"></u-toast>
	</view>
</template>
<script>
	import {
		St_admreview
	} from '@/common/enumeration/St_admreview.js'
	import {
		getArriveDetailsById, // 查询文书送达列表
		getReviewDetailByApplyid,
		saveSend,
		deleteDetailById
	} from "@/common/api/approve/notice/deliver.js"
	import moment from "../../../node_modules/moment/moment.js"
	import {
		kkfilePreview
	} from '@/common/js/urils.js'
	import {
		nanoid
	} from 'nanoid'
	import {
		minioUpload
	} from '@/common/api/upload/file.js'
	import {
		BASE_URL,
		uploadUrl, // 图片上传地址
	} from '@/common/js/request.js'
	import axios from 'axios'


	var personInfo = {
		address: undefined,
		id: undefined,
		istarget: undefined,
		istarget_text: undefined,
		phone: undefined,
		photoInfoList: undefined,
		photoinfo: undefined,
		postcode: undefined,
		primaryKey: undefined,
		recipient: undefined,
		recordid: undefined,
		sendstatus: undefined,
		sendstatus_text: undefined,
		sendtime: undefined,
		sendway: undefined,
		sendway_text: undefined
	}

	export default {
		data() {
			return {
				fileids: null,
				action: BASE_URL + uploadUrl, // 服务器上传地址
				list1: [{
					name: '待送达',
				}, {
					name: '已送达',
				}],
				index: 0,
				mailNumView: false,
				mailAdress: false,
				fileList: [],
				actionsRecipient: [],
				showRecipient: false,
				recipientnameOption: [],
				// 默认人员信息：
				// 申请人信息
				applicantList: [],
				// 代理人信息
				agentList: [],
				// 被申请人信息
				targetList: [],
				// 第三人信息
				thirdList: [],
				modeCalendar: 'single',
				showCalendar: false,
				popupStyle: {
					width: '90%',
					height: '70%'
				},
				show: false,
				undoNum: 0,
				doneNum: 0,
				itemStyle: {
					marginTop: '20rpx'
				},
				rcord: [],
				St_admreview: St_admreview,
				undoList: [],
				doneList: [],
				list: ['待送达', '已送达'],
				curNow: 0,
				personList: [],
				showSend: false,
				model1: {
					recipient: '',
					contactMode: '',
					deliveryTime: '',
					deliveryMode: '',
					mailNum: '',
					mailAddress: ''
				},
				actions: [{
						name: '直接送达',
					},
					{
						name: '委托送达',
					},
					{
						name: '邮寄送达',
					},
					{
						name: '电子送达'
					}
				],
				rules: {
					'name': {
						type: 'string',
						required: true,
						message: '请填写姓名',
						trigger: ['blur', 'change']
					},
					'contactMode': {
						type: 'string',
						len: 11,
						required: true,
						message: '请填写完整手机号',
						trigger: ['blur']
					},
					'deliveryTime': {
						type: 'string',
						required: true,
						message: '请选择发出时间',
					},
					'deliveryMode': {
						required: true,
						message: '请选择送达方式',
						trigger: ['blur']
					},
				},
				radio: '',
				switchVal: false,
				labelStyle: {
					'width': '5rem',
					'margin-right': '20rpx',
					'margin-right': '20rpx'
				},
				showOpenFlagListundo: [], // 多少个 u-collapse-item 长度就是多少
				showValueListundo: [],
				showOpenFlagListdone: [], // 多少个 u-collapse-item 长度就是多少
				showValueListdone: [],
				photoFileList: [], //存放可访问的图片
				flag: false, //标记当前保存送达人窗口是回显修改数据还是添加保存数据，true为修改 false为添加
				flagIndex: null, //标记当前回显信息在带送达列表的索引值
				flagPersonIndex: null //标记当前回显信息在人员信息列表的索引值
			}
		},
		components: {
			Upload: () => import('@/components/base/Upload.vue')
		},
		computed: {
			acceptCode() {
				return this.rcord.acceptcode.replace(/\s+/g, '')
			},
			endDate() {
				return this.getDate('end');
			}
		},
		async onLoad(options) {
			let arriveInfo = JSON.parse(options.item); // 如果传递的是字符串的话需要解析
			this.rcord = arriveInfo
			if (options.acceptcode) {
				this.acceptcode = options.acceptcode
			}
			await this.ArriveDetailsById(this.rcord.id)
			await this.getDefaultPersonInfo(this.rcord.id)
		},
		methods: {
			emitfile(value) {},
			// 回显处置附件id
			s_disposi_echoids(value) {
				this.fileids = value
			},
			//折叠打开
			openCollapseundo(value) {
				this.showOpenFlagListundo[value] = true;
				this.showOpenFlagListundo = [...this.showOpenFlagListundo]
			},
			//折叠关闭
			closeCollapseundo(value) {
				// 这里的value就是你点击收起来的折叠面板的name，因为name我设置为index，所以可以直接用value来找到下标对应的标志位
				this.showOpenFlagListundo[value] = false;
				// 这是防止 直接修改的时候 数据修改了 模板没反应过来
				this.showOpenFlagListundo = [...this.showOpenFlagListundo]
			},
			//折叠打开
			openCollapsedone(value) {
				this.showOpenFlagListdone[value] = true;
				this.showOpenFlagListdone = [...this.showOpenFlagListdone]
			},
			//折叠关闭
			closeCollapsedone(value) {
				// 这里的value就是你点击收起来的折叠面板的name，因为name我设置为index，所以可以直接用value来找到下标对应的标志位
				this.showOpenFlagListdone[value] = false;
				// 这是防止 直接修改的时候 数据修改了 模板没反应过来
				this.showOpenFlagListdone = [...this.showOpenFlagListdone]
			},
			//选中复选框
			checkbox(item) {
				item.flag = !item.flag
			},
			//文书送达的方法
			arriveSend() {
				let mark = false
				let arry = []
				this.undoList.forEach(undo => {
					if (undo.flag == true) {
						let item = undo
						item.sendstatus = 3200
						item.sendstatus_text = '已送达'
						arry.push(item)
						mark = true
					}
				})
				if (mark) {
					let currentUser = JSON.parse(sessionStorage.getItem('APPROVE_USER'))

					saveSend({
						sendUserId: currentUser.userid,
						sendUserName: currentUser.fullname
					}, arry).then((res) => {
						if (res.code != 0) {
							this.$refs.uToast.show({
								position: 'center',
								message: '送达失败',
								type: 'error'
							})
						} else {
							this.$refs.uToast.show({
								position: 'center',
								message: '送达成功',
								type: 'success'
							})
							// 重新加载数据
							this.ArriveDetailsById(this.rcord.id)
						}
					})
				} else {
					this.$refs.uToast.show({
						position: 'center',
						message: '未选中',
						type: 'default'
					})
				}
			},
			//删除送达人信息
			deletePersonInfo(index, personIndex) {
				uni.showModal({
					content: '确定删除吗？',
					success: function(res) {
						console.log(this.undoList);
						if (res.confirm) {
							this.undoList[index].personList.splice(personIndex, 1)
						} else if (res.cancel) {}
					}
				});
			},
			//回显送达人信息
			review(personIndex, index) {
				this.show = true
				this.model1.recipient = this.undoList[index].personList[personIndex].recipient
				this.model1.contactMode = this.undoList[index].personList[personIndex].phone
				this.model1.deliveryTime = this.undoList[index].personList[personIndex].sendtime
				this.model1.deliveryMode = this.undoList[index].personList[personIndex].sendway_text
				this.model1.mailNum = this.undoList[index].personList[personIndex].postcode
				this.model1.mailAddress = this.undoList[index].personList[personIndex].address
				this.fileids = this.undoList[index].personList[personIndex].photoInfoList
				if (this.model1.deliveryMode == "邮寄送达") {
					this.mailNumView = true
					this.mailAdress = true
				}
				this.flagIndex = index
				this.flagPersonIndex = personIndex
				this.flag = true
			},
			//点击保存送达人信息的按钮
			save() {
				//需要填的数据都不为空
				this.$refs.uForm.validate().then(res => {
					if (this.model1.deliveryMode == '邮寄送达') {
						if (this.model1.mailAddress && this.model1.mailNum) {
							personInfo.address = this.model1.mailAddress
							personInfo.postcode = this.model1.mailNum
						} else {
							this.$refs.uToast.show({
								position: 'center',
								message: '邮寄信息填写不完整',
								type: 'error'
							})
							return
						}
					}
					if (!this.flag) {
						//补充添加人信息对象
						personInfo.photoInfoList = this.fileids
						personInfo.id = nanoid()
						personInfo.recordid = this.undoList[this.index].id
						personInfo.sendstatus = this.undoList[this.index].sendstatus
						personInfo.sendstatus_text = this.undoList[this.index].sendstatus_text
						//将添加的人员信息加入到人员信息列表中
						this.undoList[this.index].personList.push(JSON.parse(JSON.stringify(personInfo)))
						this.$refs.uToast.show({
							position: 'center',
							message: '添加成功',
							type: 'sucess'
						})
					} else {
						this.undoList[this.flagIndex].personList[this.flagPersonIndex].recipient = this.model1
							.recipient
						this.undoList[this.flagIndex].personList[this.flagPersonIndex].phone = this.model1
							.contactMode
						this.undoList[this.flagIndex].personList[this.flagPersonIndex].sendtime = this.model1
							.deliveryTime
						this.undoList[this.flagIndex].personList[this.flagPersonIndex].sendway_text = this.model1
							.deliveryMode
						this.undoList[this.flagIndex].personList[this.flagPersonIndex].postcode = this.model1
							.mailNum
						this.undoList[this.flagIndex].personList[this.flagPersonIndex].address = this.model1
							.mailAddress
						this.undoList[this.flagIndex].personList[this.flagPersonIndex].photoInfoList = this.fileids
						this.$refs.uToast.show({
							position: 'center',
							message: '保存成功',
							type: 'sucess'
						})
						//善后工作
						this.close()
						this.flag = false
					}
					//关闭添加信息的弹窗
					this.close()
				}).catch(errors => {
					this.$refs.uToast.show({
						position: 'center',
						message: '人员信息填写不完整',
						type: 'error'
					})
					return
				})
			},
			//收件人选择窗口关闭
			recipientClose() {
				this.showRecipient = false
			},
			//收件人选择
			recipientSelect(e) {
				this.model1.recipient = e.name
				this.model1.contactMode = e.phone
				let arr = e.name.split('-')
				personInfo.recipient = arr[1]
				personInfo.phone = e.phone

				if (e.personType == 'target') {
					personInfo.istarget = 3200
				} else {
					personInfo.istarget = 3201
				}
				personInfo.istarget_text = e.personType

			},
			//弹窗日期选择
			successCalendar(e) {
				this.showCalendar = false
				this.model1.deliveryTime = e[0]
				personInfo.sendtime = e[0]
			},
			//关闭日历选择器
			closeCalendar(e) {
				this.showCalendar = false
			},
			//送达方式选择
			sexSelect(e) {
				this.model1.deliveryMode = e.name
				if (e.name == '邮寄送达') {
					this.mailAdress = true
					this.mailNumView = true
				} else {
					this.mailAdress = false
					this.mailNumView = false
				}

				if (e.name == '邮寄送达') {
					personInfo.sendway = 6003102
					personInfo.sendway_text = '邮寄送达'
				} else if (e.name == '直接送达') {
					personInfo.sendway = 6003100
					personInfo.sendway_text = '直接送达'
				} else if (e.name == '委托送达') {
					personInfo.sendway = 6003101
					personInfo.sendway_text = '委托送达'
				} else if (e.name == '电子送达') {
					personInfo.sendway = 6003103
					personInfo.sendway_text = '电子送达'
				}
			},
			//关闭送达选择
			sendClose() {
				this.showSend = false
			},
			//关闭添加信息的弹窗
			close() {
				this.show = false
				this.model1.recipient = ''
				this.model1.contactMode = ''
				this.model1.deliveryMode = ''
				this.model1.deliveryTime = ''
				this.fileids = null
			},
			//打开添加信息弹窗触发事件
			open() {},
			//新增送达人
			addPerson(index) {
				this.show = true
				//标记当前操作的是待送达列表中的第几个
				this.index = index
			},
			//文件预览
			fileView(material) {
				uni.navigateTo({
					url: '/pages/approve/notice/fileView?path=' + material.file.path,
				});
			},

			//计算警告日期与当前日期的天数差
			daysBetweenDates(starDate) {
				if (starDate) {
					// 返回天数差
					return moment(starDate).diff(moment(new Date()), 'days')
				} else {
					return undefined
				}
			},

			//当前选中的是待送达还是已送达
			sectionChange(options) {
				this.curNow = options.index;
			},
			// 返回
			goBack() {
				uni.navigateBack()
			},
			//案件状态
			statusLable(record) {
				const val = record.status
				for (const key in this.St_admreview) {
					if (this.St_admreview[key].value == val) {
						return this.St_admreview[key].name
					}
				}
				return val
			},
			//获取送达列表
			ArriveDetailsById(applyid) {
				getArriveDetailsById(applyid).then(res => {
					if (res.code === 0) {
						if (res.data && res.data.length > 0) {
							this.undoList = []
							this.doneList = []
							//用来记录待办已办的索引值
							let undoNum = -1
							let doneNum = -1
							res.data.forEach(el => {
								//添加是否选中标记属性
								this.$set(el, "flag", false)
								// 截止提醒日期转换
								if (el.warntime) {
									el.leftDay = moment(el.warntime).diff(moment(new Date()), 'days')
								}
								// 文件重复去重
								const fileItemSet = new Set()
								if (el.materialList) {
									el.materialList.forEach(material => {
										fileItemSet.add(material.matttype_text)
									})
								}
								const fileItem = [...fileItemSet]
								el.materialName = fileItem.join('，')
								//判断已送达待送达
								if (el.sendstatus == 3201) {
									undoNum = undoNum + 1
									this.showValueListundo.push(undoNum)
									this.showOpenFlagListundo.push(true)
									this.undoList.push(el)
								} else if (el.sendstatus == 3200) {
									doneNum = doneNum + 1
									this.showValueListdone.push(doneNum)
									this.showOpenFlagListdone.push(true)
									this.doneList.push(el)
								}
							})
						}
					} else {
						this.$message.error('送达详情数据查询失败')
					}
				}).finally(() => {
					this.spinning = false
				})
			},

			async getDefaultPersonInfo(id) {
				const res = await getReviewDetailByApplyid(id)
				if (res.code == 0) {
					const resObj = res.data
					this.recipientnameOption = []
					if (resObj != null && resObj != undefined) {
						// 被申请人信息：
						this.targetList = resObj.targetList
						// 申请人信息
						this.applicantList = resObj.applicantList
						// 代理人信息
						this.agentList = resObj.agentList
						// 第三人信息
						this.thirdList = resObj.thirdList
						// 送达信息
						this.arriveInfo = resObj.arriveInfo

						if (this.applicantList) {
							this.applicantList.forEach((item) => {
								item.label = '申请人-' + item.name
								item.personType = 'applicant'
								this.recipientnameOption.push(item)
							})
						}
						if (this.agentList) {
							this.agentList.forEach((item) => {
								item.label = '代理人-' + item.name
								item.personType = 'agent'
								this.recipientnameOption.push(item)
							})
						}
						if (this.targetList) {
							this.targetList.forEach((item) => {
								item.label = '被申请人-' + item.name
								item.personType = 'target'
								this.recipientnameOption.push(item)
							})
						}
						if (this.thirdList) {
							this.thirdList.forEach((item) => {
								item.label = '第三人-' + item.name
								item.personType = 'third'
								this.recipientnameOption.push(item)
							})
						}
						// 将数据插入到缓存中
						if (this.recipientnameOption) {
							this.recipientnameOption.forEach((item) => {
								let person = {
									name: '',
									phone: '',
									personType: ''
								}
								person.name = item.label
								person.phone = item.tel
								person.personType = item.personType
								this.actionsRecipient.push(person)
							})
						}
					}
				} else {
					this.$message.error('获取默认人员信息失败')
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	::v-deep .uicon-arrow-right {
		// margin-left: 100rpx;
	}

	::v-deep .uicon-arrow-down-fill {
		margin-left: 26rpx;
	}

	// .upload{
	// 	position: relative;
	// 	margin-top: 2%;

	// 	&_background {
	// 		width: 100%;
	// 		height: 100%;
	// 		position: absolute;
	// 		top: 0;
	// 		left: 0;
	// 		border: 1px dotted #d7d7d7;
	// 		border-radius: 4px;
	// 		@extend .algin_justity_center;
	// 		flex-direction: column;

	// 		&_item {
	// 			width: 100;
	// 			color: #3296fa;

	// 			span {
	// 				font-size: 1.5rem;
	// 			}
	// 		}
	// 	}

	// }
	::v-deep .u-cell__body {
		margin-top: 20rpx;
	}

	::v-deep .u-tabs__wrapper__nav {
		width: 60%;
		margin-left: 160rpx;
	}

	::v-deep .u-cell__right-icon-wrap--up {
		margin-bottom: 40rpx !important;
	}

	::v-deep .u-cell__right-icon-wrap--down {
		margin-bottom: 40rpx !important;
	}

	::v-deep .add_people_info {
		display: flex;
		justify-content: space-between;
	}

	::v-deep .u-icon__icon {
		font-size: 16px !important;
	}

	.tabs {
		width: 90%;
		margin: auto;
		margin-top: 20rpx;
		height: 100rpx;
	}

	.status {
		width: 90%;
		// margin: 5%;
		margin: 5% 5% 4.5% 5%;
		height: 120rpx;
		background-color: rgba(255, 255, 255, 1);
		border-radius: 10pt;
		display: flex;
		align-items: center;
		flex-direction: row;

		&_acceptcode {
			padding: 30rpx;
			font-family: PingFang SC;
			font-weight: 900;
			font-size: 12pt;
			text-overflow: ellipsis;
			white-space: nowrap;
			width: 13rem;
			overflow: hidden;
		}

		&_lable {
			width: 16%;
			height: 35rpx;
			background: linear-gradient(90deg, #FFD97A 0%, #FF9F00 54%, #D97E00 100%);
			position: absolute;
			right: 10%;
			padding: 10rpx;
			border-radius: 5pt;
			display: flex;
			justify-content: center;
			color: #FFFFFF;
			font-size: 10pt;
			align-items: center;
		}
	}

	.item {
		background-color: #FFFFFF;
		margin: auto;
		width: 90%;
		border-radius: 0.8rem;
		margin-top: 30rpx;
		// margin-top: 50rpx;

		&_title {
			font-weight: 900;
			font-size: 12pt;
			height: 2.5rem;
			display: flex;
			flex-direction: row;

			&_select {
				width: 1.5rem;
				height: 1.5rem;
				margin: 0.25rem;

				&_flag {
					width: 1.2rem;
					height: 1.2rem;
					// border: black solid 1px;
					border-radius: 50%;
					color: #fff;
					background-color: #00b952;
				}

				&_flag1 {
					width: 1.2rem;
					height: 1.2rem;
					// border: black solid 1px;
					border-radius: 50%;
					color: #fff;
					background-color: #dadada;
				}
			}

			&_name {
				width: 80%;
				height: 2rem;
			}
		}

		&_content {
			background-color: #FFFFFF;

			&_tip {
				display: flex;
				flex-direction: row;
				margin-top: 40rpx;

				&_text {
					color: #ACACAC;
					width: 15%;
					font-size: 30rpx;
				}

				&_status {
					display: flex;
					flex-direction: row;
					width: 85%;
					margin-right: 2rem;
					justify-content: end;

					&_flag {
						background-color: #FFA200;
						width: 20rpx;
						height: 20rpx;
						border-radius: 20pt;
						margin: auto;
					}

					&_warm {
						background-color: #ff0000;
						width: 20rpx;
						height: 20rpx;
						border-radius: 20pt;
						margin: auto;
					}
				}
			}
		}
	}

	.collapse {
		background-color: #FFFFFF;
		margin: auto;
		width: 90%;
		border-radius: 0.8rem;
		margin-top: 40rpx;

		&_title {
			font-weight: 900;
			font-size: 12pt;
			height: 3rem;
		}

		&_content {
			background-color: #FFFFFF;
		}
	}

	.file {
		display: flex;
		justify-content: end;
		width: 75%;
		margin-right: 2rem;

		&_list {
			display: flex;
			justify-content: end;
			height: 2.2rem;

			&_name {
				height: 1rem;
				color: rgba(32, 116, 212, 1);
				text-overflow: ellipsis;
				white-space: nowrap;
				width: 100%;
				overflow: hidden;
				font-size: 28rpx;
				// background-color: pink;
			}
		}
	}

	.add {
		margin-top: 30rpx;
		display: flex;
		flex-direction: column;

		&_title {
			font-size: 13pt;
			font-weight: 900
		}

		&_people {
			display: flex;
			flex-direction: row;
			margin-top: 50rpx;

			&_info {
				width: 85%;
				height: 100rpx;
				background-color: rgba(245, 246, 250, 1);
				align-items: center;
				display: flex;
				flex-direction: row;
			}
		}

		&_button {
			margin-top: 30rpx;
			height: 100rpx;

			&_icon {
				width: 100%;
				display: flex;
				justify-content: center;
			}

			&_lable {
				display: flex;
				justify-content: center;
				width: 100%;
				margin-top: 20rpx;
				font-size: 32rpx;
				color: rgba(32, 116, 212, 1);
			}
		}
	}

	.arrivefilelist {
		display: flex;
		justify-content: flex-end;
		height: 2.2rem;

		&_name {
			height: 1rem;
			// margin-left: 250rpx;
			color: rgba(32, 116, 212, 1);
			// text-overflow: ellipsis;
			// white-space: nowrap;
			// width: 300rpx;
			// overflow: hidden;
		}
	}

	.sendbutton {
		width: 100%;
		height: 2rem;

		&_sty {
			bottom: 30rpx;
			position: fixed;
			color: #FFFFFF;
			width: 60%;
			background-color: #3496FB;
			margin-left: 1.5rem;
		}
	}

	.dad {
		::v-deep .u-cell {
			height: 100rpx;
		}
	}

	.tip {
		display: flex;
		flex-direction: row;
		margin-bottom: 20rpx;
	}

	.stx {
		display: flex;
		flex-direction: row;

	}


	.sty {
		display: flex;
		flex-direction: column;

	}

	::v-deep .u-line {
		display: none;
	}

	.open-flag /deep/.u-collapse-item__content {
		height: auto !important;
	}

	::v-deep .u-transition {
		z-index: 899 !important;
	}

	::v-deep .uni-input-input {
		margin-left: 20rpx;
	}

	::v-deep .u-divider {
		margin: 0 0 0.2rem 0;
	}

	::v-deep .uni-input-placeholder {
		// border: 1px solid red;
		// text-align: right !important;
		margin-left: 80rpx;
	}

	::v-deep .u-form-item__body__right {
		flex: 6 !important;
	}

	::v-deep .u-form-item__body__left {
		flex: 2 !important;
	}

	::v-deep .u-form-item__body__left__content__label {
		letter-spacing: 0.1rem;
	}

	::v-deep .u-form-item__body__right__message {
		// border: 1px solid red;
		margin-left: 5rem !important;
	}

	::v-deep .u-button {
		border: none;
		border-radius: 8rem;
		width: 90%;
		background-color: #264AA2;
		letter-spacing: 0.2rem;
	}

	::v-deep .u-form {
		width: 90%;
		padding: 0 !important;
	}
</style>